<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<script src="../../js/jquery-3.4.1.js"></script>
<script>
    $(function(){
        var x=0;
        var y=1;
        for(var i=0;i<192;i++){
            x+=1;
            if(x==17){
                x=1;
                y+=1;
            }
            $("#table3").append("<img id="+y+"-"+x+" src='../../img/seat/index0.png'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;");
        }
        var url="";
        $.post(url,null,function(){
            $("#type").append();
        })
    })
</script>
<style>
    #img1{
        margin-left: 50px;
        margin-top: 100px;
    }
    #table1{
        margin-left: 50px;
        margin-top: 30px;
        border:  #9F9F9F solid 1px;
        height: 600px;
        width: 1180px;
    }
    #table2{
        height: 70px;
    }
    div{
        border:  #9F9F9F solid 1px;
        float:left;
    }
    #table2{
        background-image: url("../../img/seat/index7.png");
    }
    .tableq{
        width: 800px;
    }
    #table3{
        margin-top: 50px;
    }
    #table5{
        width:377px;
        height: 600px;
        position: absolute;
        margin-left: 801px;
        background: #F9F9F9;
    }
    #table501{
        width:377px;
        height: 210px;
    }
    #table502{
        margin-top: 20px;
        margin-left: 20px;
    }
    #table503img{
        width: 150px;
        height: 180px;
        border:  #9F9F9F solid 1px;
    }
    .table502neirong{
        margin-top: 5px;
        height: 50px;
        width: 190px;

    }
    #table503{
        width: 190px;
        margin-top: 20px;
    }
    #table501name{
        font-size: 30px;
        line-height: 50px;
    }
    #type{
        width: 180px;
        height: 24px;
    }
    #shij{
        height: 24px;
        width: 180px;
    }
    #table504{
        width:377px;
        height: 380px;
    }
    ul{
        list-style: none;
    }
    #showList li{
        height:40px;
        font-size: 14px;
    }
</style>
<body>
    <div>
        <img id="img1" src="../../img/seat/index6.png">
        <div id="table1">
            <div id="table2" class="tableq">

            </div>
            <div id="table4" class="tableq">
                <img src="../../img/seat/index5.png">
            </div>
            <div id="table3" class="tableq"><!--座位 --></div>
            <div id="table5">
                <div id="table501">
                    <div id="table502">
                        <img id="table503img" src="../../img/seat/index6.png" alt="图片">
                    </div>
                    <div id="table503">
                        <div id="table501name" class="table502neirong">
                            111
                        </div>
                        <div class="table502neirong">
                            <div id="type">
                            </div>
                            <div id="shij">
                                时长：110分钟
                            </div>
                        </div>
                    </div>
                </div>
                <div id="table504">
                    <ul id="showList">
                        <li>
                            影院 : 万达影城（梅溪湖步步高广场店）
                        </li>
                        <li>
                            影厅 : 3号厅特惠厅 部分按摩座椅
                        </li>
                        <li>
                            版本 : 国语3D
                        </li>
                        <li>

                        </li>
                    </ul>
                </div>
            </div>
        </div>
    </div>
</body>
</html>